<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./css/base.css" />
    <link rel="stylesheet" href="./css/commom.css" />
    <link rel="stylesheet" href="./css/tabCommon.css" />
    <link rel="stylesheet" href="./css/fuwu.css" />
  </head>

  <body>
    <!-- 头部 -->
    <div class="header">
      <!-- top -->
      <div class="Top padding">
        <div class="top">
          <div class="text">
            <span class="active">推荐</span>
            <span>关注</span>
          </div>
          <img src="./img/25.png" alt="" />
        </div>
      </div>
    </div>

    <!-- 品牌logo -->
    <ul class="tablist padding">
      <li>
        <img src="./img/26.png" alt="" />
      </li>
      <li>
        <img src="./img/27.png" alt="" />
      </li>
      <li>
        <img src="./img/28.png" alt="" />
      </li>
      <li>
        <img src="./img/29.png" alt="" />
      </li>
      <li>
        <img src="./img/30.png" alt="" />
      </li>
      <li>
        <img src="./img/31.png" alt="" />
      </li>
    </ul>

    <!-- 热门推荐 -->
    <div class="hot padding">
      <div class="ht">
        <div class="title">热门推荐</div>
        <div class="right">
          更多
          <div class="right_icon"></div>
        </div>
      </div>
      <div class="hb">
        <ul class="tab">
          <li>
            <div class="icon">
              <img src="./img/32.png" alt="" />
            </div>
            <div class="text">
              <div class="box">
                <p>健康160</p>
                <span>挂号体验就用160</span>
              </div>
              <div class="right">关注</div>
            </div>
          </li>
          <li>
            <div class="icon">
              <img src="./img/33.png" alt="" />
            </div>
            <div class="text">
              <div class="box">
                <p>货拉拉</p>
                <span>拉货机找货拉拉</span>
              </div>
              <div class="right">关注</div>
            </div>
          </li>
          <li>
            <div class="icon">
              <img src="./img/34.png" alt="" />
            </div>
            <div class="text">
              <div class="box">
                <p>最美天气</p>
                <span>懂你的天气初始最美</span>
              </div>
              <div class="right">关注</div>
            </div>
          </li>
        </ul>
      </div>
    </div>

    <!-- 关注和取消关注 -->
    <div class="attention">关注成功</div>
    <!-- 底部 -->
    <div class="footer">
      <ul>
        <li>
          <a href="./index.html">
            <img src="./img/f11.png" alt="" />

            <p class="active">首页</p>
          </a>
        </li>
        <li>
          <a href="./minsheng.html">
            <img src="./img/f2.png" alt="" />
            <p>城市民生</p>
          </a>
        </li>
        <li>
          <a href="./fuwu.html">
            <img src="./img/f3.png" alt="" />
            <p>服务号</p>
          </a>
        </li>

        <li>
          <a href="./me.html">
            <img src="./img/f4.png" alt="" />
            <p>我的</p>
          </a>
        </li>
      </ul>
    </div>

    <script src="./js/fuwu.js"></script>
  </body>
</html>
